<template>
  <div class="content">
    <p class="m-b-20">
      指标类型:
      <el-select v-model="value" placeholder="请选择">
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select>
      <el-button type="primary" plain>搜索</el-button>
    </p>
    <div class="collapse">
      <el-collapse v-model="activeNames" @change="handleChange">
        <el-collapse-item title="经营实力" name="1">
            <el-table :data="tableData">
              <el-table-column prop="date" label="序号" >
              </el-table-column>
              <el-table-column prop="name" label="名称">
              </el-table-column>
              <el-table-column prop="address" label="单位"> </el-table-column>
              <el-table-column prop="address" label="计划"> </el-table-column>
            </el-table>
        </el-collapse-item>
        <el-collapse-item title="核心技术" name="2">
          <div>
            核心技术
          </div>
        </el-collapse-item>
        <el-collapse-item title="服务品质" name="3">
          <div>
            服务品质
          </div>
        </el-collapse-item>
        <el-collapse-item title="企业治理" name="4">
          <div>
           企业治理
          </div>
         
        </el-collapse-item>
         <el-collapse-item title="绿色发展" name="5">
          <div>
           绿色发展
          </div>
         
        </el-collapse-item>
         <el-collapse-item title="品牌价值" name="6">
          <div>
           品牌价值
          </div>
        </el-collapse-item>
      </el-collapse>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      options: [
        {
          value: "选项1",
          label: "全部",
        },
          {
          value: "选项2",
          label: "经营实力",
        },
          {
          value: "选项3",
          label: "核心技术",
        },
          {
          value: "选项4",
          label: "服务品质",
        },
          {
          value: "选项5",
          label: "企业治理",
        },
          {
          value: "选项6",
          label: "绿色发展",
        },
          {
          value: "选项7",
          label: "品牌价值",
        },
      
      ],
      value: "",
      activeNames: ["1"],
      tableData: [
        {
          date: "1",
          name: "售电量",
          address: "万元",
        },
        {
          date: "2",
          name: "利润",
          address: "万元",
        },
        {
          date: "3",
          name: "资产总额",
          address: "万元",
        },
      ],
    };
  },
  mounted() {},
  methods: {
    handleChange(val) {
      console.log(val);
    },
  },
};
</script>

<style scoped>
.content {
  padding: 30px;
}
.m-b-20{
    margin-bottom: 20px;
}
.m-l-30{
    margin-left: 30px;
}
.collapse>>>.el-collapse-item__header{
  background-color:#F3F3F3!important;
  padding-left: 10px;
}
.font-weight{
  font-weight: 800;
}
</style>
